// 该文件专门用于创建整个应用的路由器
import VueRouter from "vue-router";

// 引入组件
import Home from '../views/Home.vue'
import About from '../views/About.vue'
import News from '../views/News.vue'
import Message from '../views/Message.vue'
import Detail from '../views/Detail.vue'

//创建并暴露一个路由器
const router = new VueRouter({
    routes: [{
            path: '/Home',
            name: 'home',
            component: Home,
            meta: { title: '首页' },
            children: [{
                    path: 'News',
                    name: 'news',
                    component: News,
                    meta: {
                        isAuther: true,
                        title: '新闻'
                    },
                },
                {
                    path: 'Message',
                    name: 'message',
                    component: Message,
                    meta: {
                        isAuther: true,
                        title: '消息'
                    },
                    children: [{
                        path: 'Detail',
                        name: 'detail',
                        component: Detail,
                        meta: {
                            isAuther: true,
                            title: '详情'
                        },
                        // props的第一种写法，值为对象，该对象中的所有key-value都会以props的形式传给detail组件
                        // props: { a: 1, b: 'hhh' }
                        // props的第二种写法，值为布尔值，若布尔值为真，就会把该路由组件接收到的所有params参数以prosp的形式传给detail组件
                        // props: true
                        // props的第三种写法，值为函数 
                        props({ query }) {
                            return { id: query.id, title: query.title }
                        }
                    }, ]
                },
            ]
        },
        {
            path: '/About',
            name: 'about',
            component: About,
            meta: { title: '关于' },

        }
    ]
})

// 全局前置路由守卫，每次路由切换之前被调用，初始化页面的时候调用
router.beforeEach((to, from, next) => {
    console.log('前置路由守卫', to, from);

    // 放行
    // 配置meta，判断是否需要权限进行访问
    if (to.meta.isAuther) {
        if (localStorage.getItem('school') === 'home') {
            next()
        } else {
            alert('学校名不对,没有权限查看！')
        }
    } else {
        next()
    }
})

// 全局后置路由守卫，每次路由切换之后被调用，初始化页面的时候调用
router.afterEach((to, from) => {
    console.log('后置路由守卫', to, from)
    document.title = to.meta.title || '系统'
})
export default router